<div class="clearfix">
	<ul class="nav pull-left">
		<li class="pull-left">
			{:L('SELECT_DEPARTMENT')}&nbsp; <select style="width:auto" name="d_department" id="d_department" onchange="changedepartment()">
				<option class="all" value="all">{:L('ALL')}</option>
				<volist name="departmentList" id="vo">
					<option value="{$vo.department_id}">{$vo.name}</option>
				</volist>
			</select>&nbsp;&nbsp;
		</li>
		<li class="pull-left">
			&nbsp; {:L('USER_NAME')}：<input class="span2" id="d_name" type="text" name="d_name"/>
		</li>
		&nbsp; <button class="btn" onclick="d_changeContent()">{:L('SEARCH')}</button>
	</ul>
</div>
<if condition="$role_list">
<table class="table table-hover">
	<thead>
		<tr>
			<th>&nbsp;</th>
			<th>{:L('STAFF')}</th>
			<th>{:L('DEPARTMENT')}</th>
			<th>{:L('POSITION')}</th>	
			<if condition="C('ismobile') neq 1">
			<th>{:L('SEX')}</th>
			<th>Email</th>
			<th>{:L('TELPHONE')}</th>	
			</if>
		</tr>
	</thead>
	<tfoot id="footers">
		<tr>
			<td <if condition="C('ismobile') neq 1">colspan="7"<else /> colspan="4"</if>>
				<div class="row pagination">
					<div class="span2"><span id="counts">{$count_num}</span> {:L('RECORDS')} <span id="ps">1</span>/<span id="total_pages">{$total}</span> {:L('PAGE')}</div>
					<div class="span4">
						<div><ul id="changepages">
							<li><span class='current'>{:L('FIRST_PAGE')}</span></li><li><span>« {:L('THE_PREVIOUS_PAGE')}</span></li>
							<if condition="1 lt $total">
								<li><a class="page" href="javascript:void(0)" rel="2">{:L('THE_NEXT_PAGE')} »</a></li>
							<else />
								<li><span>{:L('THE_NEXT_PAGE')} »</span></li>
							</if>
						</ul></div>
					</div>
				</div>
			</td>
		</tr>
	</tfoot>
	<tbody id="d_content">
		<if condition="role_list neq null">
		<volist name="role_list" id="vo">
		<tr>
			<td><input name="owner" type="radio" value="{$vo.role_id}" /></td>
			<td>{$vo.user_name}</td>
			<td>{$vo.department_name}</td>
			<td>{$vo.role_name}</td>	
			<if condition="C('ismobile') neq 1">
			<td><if condition="$vo['sex'] eq 1">{:L('MALE')}<elseif condition="$vo['sex'] eq 2"/>{:L('FEMALE')}</if></td>
			<td>{$vo.email}</td>
			<td>{$vo.telephone}</td>
			</if>
		</tr>
		</volist>
		<else />
			<tr>
				<td>{:L('EMPTY_DATA')}</td>
			</tr>
		</if>
	</tbody>
</table>
<else />
<div class="alert">
	{:L('EMPTY_DATA')}
</div>
</if>
<script type="text/javascript">

	$('.page').click(function(){
		var a = $(this).attr('rel');
		d_changeContent(a);
	});
	function changedepartment(){
		$('#d_name').val();
	}
	function d_changeContent(p){
		$('#footers').removeClass('hide');
		department = $('#d_department').val();
		name = $('#d_name').val();
		$.ajax({
			type:'get',
			url:'index.php?m=user&a=changeContent&department='+department+'&name='+name+'&p='+p,
			async:false,
			success:function(data){
				temp = '';
				if(data.data.list != null){
					$.each(data.data.list, function(k, v){
						temp += "<tr><td><input name='owner' type='radio' value='"+v.role_id+"' /></td><td>"+v.user_name+"</td><td>"+v.department_name+"</td><td>"+v.role_name+"</td>";
						<if condition="C('ismobile') neq 1">
							if(v.sex == 1){
								temp += "<td>{:L('MALE')}</td>";
							}else if(v.sex == 2){
								temp += "<td>{:L('FEMALE')}</td>";
							}else{
								temp += "<td>&nbsp;</td>";
							}
							temp += "<td>"+v.email+"</td>";
							temp += "<td>"+v.telephone+"</td>";
						</if>;
						temp += "</tr>";
					});
					var changepage = "";
					if(data.data.p == 1){
						changepage = "<li><span class='current'>{:L('FIRST_PAGE')}</span></li><li><span>« {:L('THE_PREVIOUS_PAGE')}</span></li>";
						if(data.data.p < data.data.total){
							changepage += "<li><a class='page' href='javascript:void(0)' rel='"+(data.data.p+1)+"'>{:L('THE_NEXT_PAGE')} »</a></li>";
						}else{
							changepage += "<li><span>{:L('THE_NEXT_PAGE')} »</span></li>";
						}
					}else if(data.data.p == data.data.total){
						changepage = "<li><a class='page' href='javascript:void(0)' rel='1'>{:L('FIRST_PAGE')}</a></li><li><a class='page' href='javascript:void(0)' rel='"+(data.data.p-1)+"'>« {:L('THE_PREVIOUS_PAGE')}</a></li><li><span>{:L('THE_NEXT_PAGE')} »</span></li>";
					}else{
						changepage = "<li><a class='page' href='javascript:void(0)' rel='1'>{:L('FIRST_PAGE')}</a></li><li><a class='page' href='javascript:void(0)' rel='"+(data.data.p-1)+"'>« {:L('THE_PREVIOUS_PAGE')}</a></li><li><a class='page' href='javascript:void(0)' rel='"+(data.data.p+1)+"'>{:L('THE_NEXT_PAGE')} »</a></li>";
					}
					$('#d_content').html(temp);
					$('#ps').html(data.data.p);
					$('#changepages').html(changepage);
					$('#counts').html(data.data.count);
					$('#total_pages').html(data.data.total);
					$('.page').click(function(){
						var a = $(this).attr('rel');
						d_changeContent(a);
					});
				}else{
					$('#d_content').html('<tr><td <if condition="C('ismobile') neq 1">colspan="7"<else /> colspan="4"</if>>{:L("NOT_FIND_THE_RESULTS_YOU_WANT")}</td></tr>');
					$('#footers').addClass('hide');
				}
			},
			dataType:'json'
		});		
	}

</script>